import React, { useState, useEffect } from 'react'
import { View, Image } from '@tarojs/components'
import Taro,{useDidShow} from '@tarojs/taro'
import api from '../../http/api'


import './index.less'

export default (props: any) => {
  const [list,setList] = useState([])
  const toDtail=(item:any)=>{
    Taro.navigateTo({
      url:`/pages/businessDetail/index?id=${item.id}`
    })
  }
  useDidShow(()=>{
    api.businessList({
      title:props.title,
    }).then((res:any)=>{
      setList(res.data.list)
    })
  })
  useEffect(()=>{
    api.businessList({
      title:props.title,
    }).then((res:any)=>{
      setList(res.data.list)
    })
  },[props.title])
  return (
    <View className='business'>
      {
        list.map((item, i) => (
          <View className='list' key={i} onClick={()=>{toDtail(item)}}>
            <Image className='img' src={item.listSrc} ></Image>
            <View className='title'>{item.title}</View>      {/* 小于10个字 */}
            <View className='cards'>
                {
                  item.card1&&(<View className='card'>折扣券</View>)
                }
                {
                  item.card2&&(<View className='card'>套餐券</View>)
                }
                {
                  item.card3&&(<View className='card'>体验券</View>)
                }
                {
                  item.card4&&(<View className='card'>满减券</View>)
                }
            </View>
          </View>
        ))
      }

    </View>
  )
}
